<template>
  <view class="card" @click="goToView">
    <view class="w-276">
      <u-image width="276rpx" height="216rpx" radius="12rpx" :src="info.logo"></u-image>
    </view>
    <view class="ml-24 h-216 flex-column flex-row-between" style="flex: 1">
      <view>
        <u--text :text="info.title" :lines="1" size="32rpx" bold></u--text>
        <view class="flex-column-center mt-16 mb-28">
          <image class="w-22 h-28 mr-8" src="/static/marker-icon.png"></image>
          <text class="fs-24 c-677585">{{ `${info.region_name}` }}</text>
        </view>
      </view>
      <view class="flex-between-center">
        <text class="c-9ca4ab fs-24">浏览 {{ info.see_num || 0 }}次</text>
        <slot name="btn">
          <u-button text="详情" color="#C5261D" :customStyle="btnStyle">
          </u-button>
        </slot>
      </view>
    </view>
  </view>
</template>
<script>
export default {
  data() {
    return {
      btnStyle: {
        backgroundColor: "transparent",
        width: "124rpx",
        height: "56rpx",
        color: "#C5261D",
        borderRadius: "8rpx",
        fontSize: "24rpx",
        padding: 0,
      },
    };
  },
  props: {
    info: {
      type: Object,
      default: () => { },
    },
  },
  methods: {
    goToView() {
      this.$emit('see_num_plus')
      this.$utils.to(`/pages2/store/store_detail?id=${this.info.id}`)
    }
  }
};
</script>
<style lang="scss" scoped>
.card {
  width: 100%;
  display: flex;
  align-items: center;
}
</style>